<template>
  <div>
    <!--条件筛选-->
    <TopFilter ref="topFilter" :list="topFilterList" :cols="3" labelWidth="110" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <!-- table -->
    <FilterTable
      ref="table"
      :columns="columns"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'records'"
      :isSelectColumn="false"
      :onRowSelectChange="selectChange"
      :onColumnsChange="columns => (this.columns = columns)"
      :isExportExcel2="true"
      :exportFileName="'厂端库存查询导出.xlsx'"
    >
    </FilterTable>
  </div>
</template>

<script>
import {getStockListByoem} from '@/api/partsmanage/partinfos/partStock/index';
import { dictionary } from '@/utils/dictMixin';
import { banWord } from '@/utils/validate';
export default {
  name: 'partStock',
  mixins: [dictionary],
  data() {
    return {
      topFilterList: this.createTopFilterList(),
      columns: this.createTableColumns(),
      fetchApi: getStockListByoem,
      fetchParams: { xhrAbort: true },
      rowSelectData: [],
    };
  },
  methods: {
    createTopFilterList() {
      return [
        {
          type: 'INPUT',
          label: '备件代码',
          fieldName: 'bjxmbh' ,
          rules: [{ validator: banWord, trigger: 'blur' }, { max: 15, message: '长度在15个字符以内', trigger: 'blur' }],
        },
        {
          type: 'INPUT',
          label: '备件名称',
          fieldName: 'bjzwmc',
          rules: [{max: 15, message: '长度在15个字符以内', trigger: 'blur' }],
        },
        { type: 'SELECT', label: '物料组', fieldName: 'material', itemList: this.createDictList('3054'), placeholder: '请选择...'},
        { type: 'INPUT', label: '库位', fieldName: '',hidden:true },
        { type: 'SELECT', label: '是否可订购', fieldName: 'bjxsbz', itemList: this.createDictList('1004'), placeholder: '请选择...'}
      ];
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '仓库',
          dataIndex: 'warehouse',
          width: 100
          // render: props => {
          //   return <span>OEM</span>
          // }
        },
        { title: '备件代码', dataIndex: 'MATNR', sorter: true},
        { title: '备件名称', dataIndex: 'MAKTX', sorter: true },
        { title: '物料组', dataIndex: 'MATKL',dictItems:this.createDictList('3054'), sorter: true },
        { title: '库位', dataIndex: 'CHARG', sorter: true },
        { title: '账面库存', dataIndex: 'MENGE', sorter: true,precision:0  },
        { title: '可用库存', dataIndex: 'ZKY', sorter: true ,precision:0 },
        { title: '占用数量', dataIndex: 'ZSD', sorter: true ,precision:0 },
        { title: '缺货数量', dataIndex: 'ZQJSL', sorter: true ,precision:0 },
        { title: '是否可订购', dataIndex: 'ZSFTY', dictItems:this.createDictList('1004'), sorter: true },
        { title: '服务商进价', dataIndex: 'XS', sorter: true ,precision:2 },
        { title: '账面总金额', dataIndex: 'ZMZJE', sorter: true ,precision:2 },
        // {
        //   title: '账面总金额', dataIndex: 'ZMZJE', sorter: true, summation: true, render: props => {
        //     props.row.ZMZJE = this.numberFormat(props.row.XS * props.row.MENGE);
        //     return <span>{props.row.ZMZJE}</span>;
        //   }
        // },
      ];
    },
    selectChange(val) {
      console.log('val', val);
      this.rowSelectData = val;
    },
    changeHandle(val) {
      let params = Object.assign({}, val, { xhrAbort: false });
      if (params.bjsycx && params.bjsycx != null && params.bjsycx.length > 0) {
        params.bjsycx = params.bjsycx.join(",");
      }
      // this.fetchParams = Object.assign({}, val);
      this.fetchParams = params;
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    }
  }
};
</script>

<style scoped></style>
